<template>
  <div class="word-container">
    <div class="left-container">
      <div class="form">
        <div class="form-title">民事起诉状</div>
        <div class="form-item">
          <div class="form-item-label">原告：</div>
          <div class="form-item-value">
            <Input
              style="width: calc(100% - 15rem)"
              v-model="info.yg"
              placeholder="请输入原告......"
            />
            <Input
              style="width: 14rem; margin-left: 1rem"
              v-model="info.yg2"
              placeholder="请输入子名......"
            />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">
            <Dropdown @on-click="selchange">
              <a href="javascript:void(0)">
                {{ info.fddlr }}：
                <Icon type="ios-arrow-down"></Icon>
              </a>
              <DropdownMenu slot="list">
                <DropdownItem name="负责人">负责人</DropdownItem>
                <DropdownItem name="法定代表人">法定代表人</DropdownItem>
              </DropdownMenu>
            </Dropdown>
          </div>
          <div class="form-item-value">
            <Input v-model="info.fzr" placeholder="请输入负责人......" />
          </div>
        </div>

        <div class="form-item">
          <div class="form-item-label">地址：</div>
          <div class="form-item-value">
            <Input v-model="info.dz" placeholder="请输入地址......" />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">代理人：</div>
          <div class="form-item-value">
            <Input
              v-model="info.dlr2[0].value"
              placeholder="请输入代理人......"
            />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label"></div>
          <div class="form-item-value">
            <Input
              v-model="info.dlr2[1].value"
              placeholder="请输入代理人......"
            />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">送达地址：</div>
          <div class="form-item-value">上海市浦东新区世纪大道88号1706室</div>
        </div>
        <div class="form-item">
          <div class="form-item-label">被告：</div>
          <div class="form-item-value">
            <Input v-model="info.bg" placeholder="请输入被告......" />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">性别：</div>
          <div class="form-item-value">
            <RadioGroup v-model="info.sex">
              <Radio label="男"></Radio>
              <Radio label="女"></Radio>
            </RadioGroup>
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">民族：</div>
          <div class="form-item-value">
            <Input v-model="info.minzu" placeholder="请输入被告......" />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">出生年月：</div>
          <div class="form-item-value">
            <DatePicker
              @on-change="getBirthDay"
              format="yyyy年MM月dd日"
              type="date"
              placeholder="选择日期"
              style="width: 200px"
            ></DatePicker>
            <!-- <Input v-model="info.birthDay" placeholder="请输入被告......" /> -->
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">身份证号：</div>
          <div class="form-item-value">
            <Input
              @on-blur="CheckIdentityCode"
              v-model="info.sfz"
              placeholder="请输入身份证......"
            />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">住址：</div>
          <div class="form-item-value">
            <Input v-model="info.liveAdress" placeholder="请输入地址......" />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">户籍地：</div>
          <div class="form-item-value">
            <Input v-model="info.hjd" placeholder="请输入户籍地......" />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">联系电话：</div>
          <div class="form-item-value">
            <Input
              @on-blur="checkPhone"
              v-model="info.phone"
              placeholder="请输入联系电话......"
            />
          </div>
        </div>

        <div class="form-title2">诉讼请求：</div>
        <div class="form-item">
          <div class="form-text">
            1. 请求法院依法判决被告支付原告已支付的代偿款&#12288;
            <Input
              v-model="info.dck"
              placeholder="请输入代偿款......"
              style="width: 100px"
            />&#12288;元
          </div>
        </div>

        <div class="form-item">
          <div class="form-text">
            2. 请求法院依法判决被告支付未付保费&#12288;
            <Input
              v-model="info.wzfbf"
              placeholder="请输入未支付保费......"
              style="width: 100px"
            />&#12288;元
          </div>
        </div>
        <div class="form-item">
          <div class="form-text">
            3. 请求法院依法判决被告向原告以&#12288;
            {{ updateJs() }}&#12288;为基数按
            <Input
              v-model="info.rateZh"
              placeholder="请输入利率......"
              style="width: 100px"
            />支付自
            <DatePicker
              @on-change="timeChange"
              format="yyyy年MM月dd日"
              type="date"
              placeholder="选择日期"
              style="width: 200px"
            ></DatePicker
            >&#12288;至判决生效日止的违约金，暂算至
            <DatePicker
              @on-change="timeChange1"
              format="yyyy年MM月dd日"
              type="date"
              placeholder="选择日期"
              style="width: 200px"
            ></DatePicker>
            ，违约金为{{ updateWyj() }}元;
          </div>
        </div>
        <div class="form-item">
          <div class="form-text">
            4. 请求法院依法判决被告承担本案的诉讼费、公告费等相关费用。
          </div>
        </div>
        <div class="form-title2">事实与理由：</div>
        <div class="form-item">
          <div class="form-text">
            被告于 &#12288;
            <DatePicker
              @on-change="timeChange3"
              format="yyyy年MM月dd日"
              type="date"
              placeholder="选择日期"
              value="2020-2-3"
              style="width: 200px"
            ></DatePicker
            >&#12288;签订《
            <Input
              v-model="info.tbdName"
              placeholder="请输入保单......"
              style="width: 320px"
            />》， 并于
            <DatePicker
              @on-change="timeChange8"
              value="2020-2-21"
              format="yyyy年MM月dd日"
              type="date"
              placeholder="选择日期"
              style="width: 200px"
            ></DatePicker
            >出具相应《保险单》，保险单约定：被保险人为&#12288;
            <Input
              v-model="info.bbxr"
              placeholder="请输入金额......"
              style="width: 300px"
            />&#12288;，保险金额为&#12288;
            <Input
              v-model="info.bxMoney"
              placeholder="请输入金额......"
              style="width: 100px"
            />&#12288;元，保险期间自个人贷款合同项下贷款发放之日起，至清偿贷款全部本息之日止，保费缴纳方式为每月按时缴纳，缴纳日期为约定扣款之日，月保费率为&#12288;
            <Input
              v-model="info.bxRate"
              placeholder="请输入金额......"
              style="width: 100px"
            />&#12288;%。每月保险费为&#12288;
            <Input
              v-model="info.monthPremium"
              placeholder="请输入金额......"
              style="width: 100px"
            />&#12288;元；投保人拖欠任何一期贷款达80天（不含），保险人依据保险合同约定向被保险人进行理赔。被告与被保险人于&#12288;
            <DatePicker
              @on-change="timeChange4"
              format="yyyy年MM月dd日"
              type="date"
              placeholder="选择日期"
              style="width: 200px"
            ></DatePicker
            >&#12288;
            <Dropdown @on-click="selchange1">
              <a href="javascript:void(0)">
                {{ info.qd }}
                <Icon type="ios-arrow-down"></Icon>
              </a>
              <DropdownMenu slot="list">
                <DropdownItem name="签订">签订</DropdownItem>
                <DropdownItem name="线上签订">线上签订</DropdownItem>
              </DropdownMenu> </Dropdown
            >《&#12288;
            <Input
              v-model="info.dkhtName"
              placeholder="请输入金额......"
              style="width: 300px"
            />&#12288;》。原告系被告的保证人。被告于&#12288;
            <DatePicker
              @on-change="timeChange6"
              format="yyyy年MM月dd日"
              type="date"
              placeholder="选择日期"
              style="width: 200px"
            ></DatePicker
            >&#12288;收到被保险人发放的贷款&#12288;
            <Input
              v-model="info.ffdk"
              placeholder="请输入金额......"
              style="width: 100px"
            />
            &#12288;元，原被告的保险合同约定，在保险期间内，被告拖欠被保险人任何一期贷款达80天（不含），原告即向被保险人进行理赔，理赔后原告有权要求被告支付理赔款项、未付保费、违约金、理赔及催收产生的其它费用等。现因被告未继续按照贷款协议履行还款义务，原告于&#12288;
            {{ info.startTime }}&#12288;向被保险人支付代偿款&#12288;
            {{ info.dck }}&#12288;元，故依法取得代位向被告求偿的权利。
          </div>
          <div class="form-text">
            &#12288;&#12288;原告多次向被告进行追讨，但被告均不予理睬，为保障原告的合法权益，特依《中华人民共和国民事诉讼法》相关条款向贵院提起诉讼，望判如所请，请如所愿。
          </div>
        </div>
        <div class="form-item" style="text-align: right">
          <div class="right-info">
            <div class="info-item">
              <div class="info-title">具状人：</div>
              <div class="info-body">{{ info.yg }}</div>
            </div>
            <div class="info-item">盖章</div>
            <div class="info-item">
              &#12288;
              <DatePicker
                @on-change="timeChange5"
                format="yyyy年MM月dd日"
                type="date"
                placeholder="选择日期"
              ></DatePicker
              >&#12288;
            </div>
          </div>
        </div>
        <div class="form-title2">附诉讼请求计算明细：</div>
        <div class="form-item">
          <div class="form-item-label">计算规则：</div>
          <div class="form-item-value">
            <span style="margin: 0 10px">期限单位:</span>
            <RadioGroup v-model="info.isYear" @on-change="updateAllDays">
              <Radio label="日"></Radio>
              <Radio label="年"></Radio>
            </RadioGroup>
            <span style="margin: 0 10px">基数公式:</span>
            <RadioGroup v-model="info.isAdd2" @on-change="updateJs">
              <Radio label="1"></Radio>
              <Radio label="(1+2)"></Radio>
            </RadioGroup>
          </div>
        </div>
        <div class="form-item">
          <div class="form-text">
            1. 请求法院依法判决被告支付原告已支付的代偿款&#12288;
            {{ info.dck }}&#12288;元
          </div>
        </div>

        <div class="form-item">
          <div class="form-text">
            2. 未付保费&#12288;
            {{ info.wzfbf }}&#12288;元
          </div>
        </div>
        <div class="form-item">
          <div class="form-text">
            3. 违约金，自&#12288;
            {{ info.startTime }}&#12288;暂算至
            {{ info.endTime }}
            &#12288;，共计
            {{ info.allDays }}&#12288;{{
              info.isYear
            }}&#12288;，违约金为：上述{{ info.isAdd2 }}*&#12288;
            <Input
              v-model="info.rate"
              placeholder="请输入金额......"
              style="width: 100px"
            />
            &#12288;%*&#12288;
            {{ info.allDays }}
            &#12288;={{ updateWyj() }}元;
            <br />
            以上费用总计{{ updateFinalMoney() }}元
          </div>
        </div>

        <div class="form-title">证据目录</div>
        <div class="form-item">
          <div class="form-text">
            1.《
            <Input
              style="width: 150px"
              v-model="info.bxdName"
              @on-change="getFullBxdName"
              placeholder="请输入保险单名......"
            />》及《中国大地个人贷款保证保险保险单》
          </div>
        </div>
        <div class="form-item">
          <div class="form-text">拟证明：原被告之间的保证保险关系。</div>
        </div>
        <div class="form-item">
          <div class="form-text">
            2.《
            <Input
              style="width: 150px"
              v-model="info.grdkht"
              placeholder="请输入贷款机构......"
            />》
          </div>
        </div>
        <div class="form-item">
          <div class="form-text">拟证明：被告向被保险人贷款。</div>
        </div>
        <div class="form-item">
          <div class="form-text">
            3.
            <Input
              style="width: 150px"
              v-model="info.dw"
              placeholder="请输入贷款机构......"
            />贷款借据
          </div>
        </div>
        <div class="form-item">
          <div class="form-text">拟证明：被告已收到贷款。</div>
        </div>
        <div class="form-item">
          <div class="form-text">4.还款凭证</div>
        </div>
        <div class="form-item">
          <div class="form-text">拟证明：被告违约。</div>
        </div>
        <div class="form-item">
          <div class="form-text">5.代偿债务与权益转让确认书</div>
        </div>
        <div class="form-item">
          <div class="form-text">
            拟证明：原告已向被保险人支付了代偿款，履行了保险义务，取得代位求偿权。
          </div>
        </div>
        <div class="form-title">担保函</div>
        <div class="form-item">
          <div class="form-item-label">统一社会信用代码：</div>
          <div class="form-item-value">
            <Input
              v-model="info.tyshxydm"
              placeholder="请输入统一社会信用代码......"
            />
          </div>
        </div>
        <div class="form-item">
          <div class="form-item-label">担保金额：</div>
          <div class="form-item-value">
            <Input v-model="info.dbje" placeholder="请输入担保金额......" />
          </div>
        </div>
        <div class="form-title">保全申请书</div>
        <div class="form-title2">事实与理由：</div>
        <div class="form-item" style="margin-bottom: 150px">
          <div class="form-text">
            申请人诉被申请人
            <Input
              v-model="info.bqsqInfo"
              placeholder="请输入内容......"
              style="width: 320px"
            />案
          </div>
        </div>
        <Button
          class="download-btn"
          size="large"
          icon="ios-download-outline"
          type="primary"
          :loading="loading"
          shape="circle"
          @click="downloadFile"
        ></Button>
      </div>
    </div>
    <Right :info="info" ref="rightInfo" />
  </div>
</template>

<script>
import Right from "./Right";
// import axios from "axios";
import { exportQSZ } from "@/api";
// import qs from "qs";
export default {
  data() {
    return {
      cityArr: {
        11: "北京",
        12: "天津",
        13: "河北",
        14: "山西",
        15: "内蒙古",
        21: "辽宁",
        22: "吉林",
        23: "黑龙江",
        31: "上海",
        32: "江苏",
        33: "浙江",
        34: "安徽",
        35: "福建",
        36: "江西",
        37: "山东",
        41: "河南",
        42: "湖北",
        43: "湖南",
        44: "广东",
        45: "广西",
        46: "海南",
        50: "重庆",
        51: "四川",
        52: "贵州",
        53: "云南",
        54: "西藏",
        61: "陕西",
        62: "甘肃",
        63: "青海",
        64: "宁夏",
        65: "新疆"
      },
      info: {
        isYear: "年",
        isAdd2: "1",
        dbje: 0,
        tyshxydm: "",
        yg: "中国大地财产保险股份有限公司",
        yg2: "",
        ygName: "",
        rateZh: "日千分之一",
        sex: "男",
        minzu: "汉族",
        bgName: "",
        birthDay: "",
        chuJuTime: "2020年2月21日",
        dw: "",
        fzr: "",
        grdkht: "",
        bxdName: "",
        fullBxdName: "",
        bxdInfo: "于",
        dz: "",
        bqsqInfo: "保险人代为求偿权纠纷",
        dlr: [
          {
            name: "程律师",
            place: "上海融力天闻律师事务所律师",
            phone: "15xxxxxxx82"
          },
          {
            name: "",
            place: "",
            phone: "13xxxxxxx28"
          }
        ],
        dlr2: [
          { value: "程律师，上海融力天闻律师事务所律师，15xxxxxxx82" },
          {
            value:
              "                                                                 13xxxxxxx28"
          }
        ],
        bg: "",
        sfz: "",
        liveAdress: "",
        hjd: "",
        phone: "",
        dck: 0,
        wzfbf: 0,
        js: 0,
        bbxr: "",
        startTime: "",
        ffdk: 0,
        endTime: "",
        wyj: 0,
        tbdName: "中国大地财产保险股份有限公司个人贷款保证保险投保单",
        cjTime: "2020年2月3日",
        bxMoney: 0,
        rate: 0.1,
        bxRate: 0,
        qd: "签订",
        monthPremium: 0,
        signTime: "",
        dkTime: "",
        editTime: "",
        allDays: 0,
        finalMoney: 0,
        computeMoney: 0,
        fddlr: "负责人",
        ccxs: [],
        dkhtName: "个人贷款合同（无担保条款）",
        isNextLine: { time: 0, value: "" }
      },
      loading: false
    };
  },

  beforeCreate() {
    if (!window.user) {
      this.$router.replace("/login");
    }
  },
  components: {
    Right
  },
  computed: {},
  methods: {
    updateJs() {
      let js;
      if (this.info.isAdd2 == "1") {
        js = parseFloat(this.info.dck);
      } else {
        js = parseFloat(this.info.wzfbf) + parseFloat(this.info.dck);
      }
      if (this.$refs && this.$refs.rightInfo) {
        if (parseInt(this.info.wzfbf)) {
          this.$refs.rightInfo.num = 3;
        } else {
          this.$refs.rightInfo.num = 2;
        }
      }

      this.info.js = parseFloat(js.toFixed(2));
      this.updateWyj();
      return this.info.js;
    },
    updateWyj() {
      let wyj = (this.info.js * this.info.rate * this.info.allDays) / 100;
      this.info.wyj = parseFloat(wyj.toFixed(2));
      return this.info.wyj;
    },
    updateAllDays() {
      if (this.info.startTime != "" && this.info.endTime != "") {
        let sDataStr = this.info.startTime
          .replace("年", "/")
          .replace("月", "/")
          .replace("日", "");
        let startTime = new Date(Date.parse(sDataStr)).getTime();
        let eTimeStr = this.info.endTime
          .replace("年", "/")
          .replace("月", "/")
          .replace("日", "");
        let endTime = new Date(Date.parse(eTimeStr)).getTime();
        let dates = Math.abs(startTime - endTime) / (1000 * 60 * 60 * 24);
        this.info.allDays = dates;
        if (this.info.isYear == "年") {
          this.info.allDays = dates / 365;
          this.info.allDays = parseFloat(this.info.allDays.toFixed(3));
        }
        this.updateWyj();
        return dates;
      } else {
        this.updateWyj();
        return 0;
      }
    },
    updateFinalMoney() {
      let finalMoney = parseFloat(this.info.js) + parseFloat(this.info.wyj);
      this.info.finalMoney = parseFloat(finalMoney.toFixed(2));
      return this.info.finalMoney;
    },
    getUser() {},
    getBirthDay(value) {
      this.info.birthDay = value;
    },
    timeChange(value) {
      this.info.startTime = value;
      this.updateAllDays();
    },
    timeChange1(value) {
      this.info.endTime = value;
      this.updateAllDays();
    },
    timeChange3(value) {
      this.info.cjTime = value;
      if (value) {
        this.info.bxdInfo =
          "于" + value + "签订《" + this.info.tbdName + "》，并于";
      } else {
        this.info.bxdInfo = "于";
      }
    },
    timeChange4(value) {
      this.info.signTime = value;
    },
    timeChange5(value) {
      this.info.editTime = value;
    },
    timeChange6(value) {
      this.info.dkTime = value;
    },
    timeChange7(value) {
      this.info.zfdckTime = value;
    },
    timeChange8(value) {
      this.info.chuJuTime = value;
    },
    selchange(value) {
      this.info.fddlr = value;
    },
    selchange1(value) {
      this.info.qd = value;
    },
    CheckIdentityCode(code) {
      let tip = "";
      if (code.length == 0 || code == null || code == undefined) {
        tip = "请输入身份证号!";
      }
      // let info = "";
      let reg = /(^\d{15}$)|(^\d{17}([0-9]|X)$)/i;
      if (!reg.test(code)) {
        tip = "格式不正确！";
      }
      code = code.replace(/x$/i, "a");
      if (this.cityArr[parseInt(code.substr(0, 2))] == null) {
        tip = "包含非法地区！";
      }
      let birthDay =
        code.substr(6, 4) +
        "-" +
        Number(code.substr(10, 2)) +
        "-" +
        Number(code.substr(12, 2));
      let d = new Date(birthDay.replace(/-/g, "/"));
      if (
        birthDay !=
        d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate()
      ) {
        tip = "包含非法出生日期！";
      }

      if (tip) {
        this.$Message.error(tip);
      }
    },
    IdentityCodeValid(code) {
      let city = {
        11: "北京",
        12: "天津",
        13: "河北",
        14: "山西",
        15: "内蒙古",
        21: "辽宁",
        22: "吉林",
        23: "黑龙江 ",
        31: "上海",
        32: "江苏",
        33: "浙江",
        34: "安徽",
        35: "福建",
        36: "江西",
        37: "山东",
        41: "河南",
        42: "湖北 ",
        43: "湖南",
        44: "广东",
        45: "广西",
        46: "海南",
        50: "重庆",
        51: "四川",
        52: "贵州",
        53: "云南",
        54: "西藏 ",
        61: "陕西",
        62: "甘肃",
        63: "青海",
        64: "宁夏",
        65: "新疆",
        71: "台湾",
        81: "香港",
        82: "澳门",
        91: "国外 "
      };
      let tip = "";
      let pass = true;

      if (
        !code ||
        !/^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i.test(
          code
        )
      ) {
        tip = "身份证号格式错误";
        pass = false;
      } else if (!city[code.substr(0, 2)]) {
        tip = "地址编码错误";
        pass = false;
      } else {
        // 18位身份证需要验证最后一位校验位
        if (code.length == 18) {
          code = code.split("");
          // ∑(ai×Wi)(mod 11)
          // 加权因子
          let factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
          // 校验位
          let parity = [1, 0, "X", 9, 8, 7, 6, 5, 4, 3, 2];
          let sum = 0;
          let ai = 0;
          let wi = 0;
          for (let i = 0; i < 17; i++) {
            ai = code[i];
            wi = factor[i];
            sum += ai * wi;
          }
          // let last = parity[sum % 11];
          if (parity[sum % 11] != code[17]) {
            tip = "校验位错误";
            pass = false;
          }
        }
      }
      if (!pass) {
        this.$Message.error(tip);
      }
      return pass;
    },
    checkPhone() {
      let tel = /^0\d{2,3}-?\d{7,8}$/;
      let phone = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
      if (this.info.phone.length == 11) {
        // 手机号码
        if (phone.test(this.info.phone)) {
          return true;
        }
      } else if (
        this.info.phone.length == 13 &&
        this.info.phone.indexOf("-") != -1
      ) {
        if (tel.test(this.info.phone)) {
          return true;
        }
      }
      this.$Message.error("请输入有效的电话号码！");
    },
    clone(obj) {
      let temp = null;
      if (obj instanceof Array) {
        temp = obj.concat();
      } else if (obj instanceof Function) {
        // 函数是共享的是无所谓的，js也没有什么办法可以在定义后再修改函数内容
        temp = obj;
      } else {
        temp = new Object();
        Object.keys(obj).forEach(key => {
          let val = obj[key];
          temp[key] = typeof val == "object" ? this.clone(val) : val;
        });
      }
      return temp;
    },
    toThousands(s) {
      const n = 2;
      let reg = `/[^\\d\\.-]/g`;
      s = parseFloat((s + "").replace(reg, "")).toFixed(n) + "";
      let l = s
          .split(".")[0]
          .split("")
          .reverse(),
        r = s.split(".")[1];
      let t = "";
      for (let i = 0; i < l.length; i++) {
        t += l[i] + ((i + 1) % 3 == 0 && i + 1 != l.length ? "," : "");
      }
      return (
        t
          .split("")
          .reverse()
          .join("") +
        "." +
        r
      );
    },
    getFullBxdName() {
      if (this.info.bxdName) {
        this.info.fullBxdName = "《" + this.info.bxdName + "》及";
      } else {
        this.info.fullBxdName = "";
      }
    },
    downloadFile() {
      this.loading = true;
      // let url = "http://122.51.140.204:3000/word";
      let data = this.clone(this.info);
      data.dck = parseFloat(data.dck);
      data.wzfbf = parseFloat(data.wzfbf);
      if (!data.wzfbf) {
        data.wzfbf = null;
      }

      if (!data.bqsqInfo.trim()) {
        data.bqsqInfo = "        ";
      }
      data.bg =
        data.bg +
        "，" +
        data.sex +
        "，" +
        data.minzu +
        "，" +
        data.birthDay +
        "生";
      data.ffdk = parseFloat(data.ffdk);
      data.bxMoney = parseFloat(data.bxMoney);
      data.monthPremium = parseFloat(data.monthPremium);
      data.bgName = data.bg.split("，")[0];
      data.ygName = data.yg + data.yg2.trim();

      data.dlr.forEach((item, index) => {
        let infos = data.dlr2[index].value.split("，");
        if (infos.length > 1) {
          item.name = infos[0];
          item.place = infos[1].substring(0, infos[1].length - 2);
          item.phone = infos[2];
        } else {
          item.phone = data.dlr2[index].value.trim();
          data.dlr2[index].value =
            "                                    " + item.phone;
        }
      });
      let keys = Object.keys(data);
      keys.forEach(key => {
        if (typeof data[key] == "number") {
          data[key] = this.toThousands(data[key]);
        }
        if (key.indexOf("Time") > -1) {
          let time = data[key]
            .replace("年", "-")
            .replace("月", "-")
            .replace("日", "-");
          let times = time.split("-");
          data[key] =
            times[0] +
            "年" +
            parseInt(times[1]) +
            "月" +
            parseInt(times[2]) +
            "日";
        }
      });
      data.ccxs1 = "";
      if (data.liveAdress != "") {
        data.ccxs1 = data.bgName + "名下坐落于" + data.liveAdress + "的房屋。";
      }
      data.ccxs2 = "";
      if (data.hjd != "") {
        data.ccxs2 = data.bgName + "名下坐落于" + data.hjd + "的房屋。";

        data.hjd = "户籍地：" + data.hjd;
      }
      data.allDays = parseInt(data.allDays);

      if (data.editTime.indexOf("NaN") > -1) {
        data.editTime = "    年  月  日";
      }

      console.log(JSON.stringify(data));
      exportQSZ(data).then(() => {
        window.location.href =
          "http://122.51.140.204:3000/output/result/result.zip";
        this.loading = false;
      });
    }
  }
};
</script>
<style>
.word-container {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0rem;
  background: white;
}
.left-container {
  left: 0;
  width: 50%;
  height: 100%;
  text-align: left;
  overflow-y: scroll;
}

.left-container .form {
  width: 100%;
  height: 100%;
  padding: 3rem;
}
.left-container .download-btn {
  position: absolute !important;
  bottom: 3rem;
  right: 55%;
}
.left-container .form-title {
  width: 100%;
  padding: 0.5rem 1rem;
  text-align: center;
  font-size: 25px;
  font-weight: bold;
}

.left-container .form-title2 {
  width: 100%;
  padding: 0.5rem 1rem;
  text-align: left;
  font-size: 20px;
  font-weight: bold;
}
.left-container .form .form-item {
  width: 100%;
  padding: 0.5rem 1rem;
}

.left-container .form .form-item .info-title {
  width: 5rem;
  display: inline-block;
}
.left-container .form .form-item .info-body {
  width: calc(100% - 5rem);
  display: inline-block;
}

.left-container .form .form-item .right-info {
  width: 50%;
  text-align: center;
  display: inline-block;
}
.left-container .form .form-item .right-info .info-item {
  width: 100%;
  padding: 0.5rem 1rem;
  font-size: 18px;
}
.left-container .form .form-item .form-text {
  width: 100%;
  font-size: 18px;
  line-height: 38px;
}
.left-container .hidden {
  display: none;
}
.left-container .form .form-item .form-item-label {
  display: inline-block;
  width: 10rem;
  font-size: 1rem;
}
.left-container .form .form-item .form-item-value {
  display: inline-block;
  width: calc(100% - 10rem);
  font-size: 1rem;
}
</style>
